<template>
	<view>
		<TopNav title="生产记录"></TopNav>
		<SearchMenu @search="handleSearch" @reset="handleReset">
			<template v-slot:search>
				<van-cell title="塘口名称">
					<van-field v-model="queryParams.culturePondName" placeholder="输入塘口名称查询" :border="false"
						input-align="right" class="padding-none" />
				</van-cell>
			</template>
		</SearchMenu>

		<view class="cu-card case">
			<view class="cu-item shadow padding" v-for="item in list" :key="item.id" @click="handleToDetail(item)">
				<view class="flex justify-between align-baseline">
					<text class="text-bold text-xl">{{item.culturePondName}}</text>
					<text>{{item.createTime}}</text>
				</view>
				<view class="flex justify-between align-end">
					<view class="full-width">
						<view class="flex justify-between">
							<view class="basis-df">
								<text class="text-gray text-width">pH值：</text>
								<text>{{item.ph || '-'}}</text>
							</view>
							<view class="basis-df">
								<text class="text-gray text-width">透明度：</text>
								<text>{{item.transparency || '-'}}m</text>
							</view>

						</view>
						<view class="flex justify-between ">
							<view class="basis-df">
								<text class="text-gray text-width">平均水温：</text>
								<text>{{item.waterTemperature || '-'}}℃</text>
							</view>
							<view class="basis-df text-left">
								<text class="text-gray text-width">饲料投喂：</text>
								<text>{{item.feedstuffUsage || '-'}}{{item.feedstuffUsageUnit}}</text>
							</view>


						</view>
					</view>
					<view class="padding-left shrink-0 text-center">
						<view class="padding-xs shrink-0">
							<image :src="baseUrl + item.createUserAvatar" mode="widthFix"
								class="cu-avatar sm radius bg-transparent">
							</image>
							<view>{{item.createUsername || '-'}}</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<u-loadmore :status="loadStatus" @loadmore="getMoreList" v-if="list.length" />
		<view class="bottom-tools padding flex justify-around bg-white">
			<van-button class='basis-sm' plain hairline type="info" @click="handleToDrafts">草稿箱</van-button>
			<van-button class='basis-sm' type="info" @click="handleToEdit">
				新增记录
			</van-button>
		</view>
		<van-empty description="暂无数据" v-if="!list.length" />
	</view>
</template>

<script>
	import {
		list
	} from "@/api/work/production"
	import mixins from "@/mixins"
	export default {
		mixins: [mixins],
		data() {
			return {
				baseUrl: getApp().globalData.config.baseUrl,
				list: [],
				loadStatus: 'loadmore',
				queryParams: {
					startDate: '',
					endDate: '',
					culturePondName: '',
					productionBaseId: undefined,
					pageSize: 10,
					pageNum: 1,
					submitMark: true
				},

			};
		},
		onShow() {
			this.queryParams.productionBaseId = this.$store.state.user.baseInfo.id
			this.getList()
		},
		onReachBottom() {
			if (this.loadStatus === 'nomore') return
			this.queryParams.pageNum += 1
			this.getList()
		},
		methods: {
			getList() {
				list(this.queryParams).then(res => {
					this.listFormat(res)
				})
			},
			getMoreList() {
				this.queryParams.pageNum += 1
				this.getList()
			},

			handleToDetail(obj) {
				this.$tab.navigateTo('./detail?id=' + obj.id)
			},
			handleToEdit() {
				this.$tab.navigateTo('./edit')
			},
			handleToDrafts() {
				this.$tab.navigateTo('./drafts')
			},
			handleReset(query) {
				this.queryParams = {
					...this.queryParams,
					...query,
					culturePondName: '',
					pageNum: 1
				}
				this.getList()
			},
			handleSearch(query) {
				this.queryParams = {
					...this.queryParams,
					...query,
					pageNum: 1
				}
				this.getList()
			}
		}
	}
</script>

<style lang="scss">
	@import "@/common/var.scss";
	page {
		@include fixed-bottom;
	}
	
</style>
<style lang="scss" scoped>
	.text-width {
		width: 75px;
		display: inline-block;
	}
</style>